﻿<html>
<head>
<title></title>

<script src="../../easyui/jquery-1.8.0.min.js" type="text/javascript"></script>
<script src="../../easyui/jquery.easyui.min.js" type="text/javascript"></script>

<link href="../../Common/CSS/DrawMult1.css" rel="stylesheet" type="text/css" />
<link href="css/jquery-ui-1.10.3.custom.css" rel="stylesheet" type="text/css" />
<link href="css/jquery-ui-1.10.3.custom.min.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="js/jquery.min.js"></script>
<script src="js/highcharts.js" type="text/javascript"></script>
<script src="js/modules/exporting.js" type="text/javascript"></script>

   
<script type="text/JavaScript">

function test(){
var obj =[-3,-2,0,1,7,15,16,17,23,24,26,33,34,35,45,44,37,34,32,30,25,21,20,16,14];
getArray(obj);
}


function getArray(data) {

    var ArrVar =[0,10,20,30,100];
	var ArrVar_=[0,0,0,0,0];
    var len = data.length;
    var array = new Array(len);
    var seriseArr = [];
	
	var tempArr=[[],[],[],[],[]];
	
	for(var i=0;i<ArrVar.length;i++)
	{
		if(data[0]<ArrVar[i]){
		
		ArrVar_[i]=1;
		break;
		}
		
	}
	var stepVar =360 / len;
	var xValue=0;
    for (var i = 0; i < len; i++) 
	{
        
		if(i>0){
			for(var j=0;j<ArrVar.length;j++){
			
				var b =(data[i-1]-ArrVar[j]);//>>31;//&&(array[i][1]-ArrVar[j]);
				var b1=(data[i]-ArrVar[j]);//>>31;
				if(b*b1<0){//b和b1异号
					data[i]=ArrVar[j];
				}
			}
	   
	   }
		var xValue=xValue+stepVar;  //  intrevalVar* (i + 1);
		if(data[i]<=ArrVar[0])
        array[i] = [xValue, data[i],ArrVar[0]];
		else if(data[i]<=ArrVar[1])
		array[i] = [xValue,ArrVar[0], data[i]];
		else if(data[i]<=ArrVar[2])
		array[i] = [xValue,ArrVar[1], data[i]];
		else if(data[i]<=ArrVar[3])
		array[i] = [xValue,ArrVar[2], data[i]];
		else if(data[i]<=ArrVar[4])
		array[i] = [xValue,ArrVar[3], data[i]];
	  
	}
	
	for(var i=0;i<len;i++)
	{
	
		for(var n=0;n<ArrVar.length;n++){
			if(data[i]<ArrVar[n]){
				tempArr[n].push(array[i]);
				break;
			}
			else if(data[i]==ArrVar[n]){
				tempArr[n].push(array[i]);
				ArrVar_[n]=ArrVar_[n]+1;
				if(ArrVar_[n]==2){
							seriseArr.push(tempArr[n]);
							ArrVar_[n]=0;
							tempArr[n]=[];
							}
							
				if(n<4){
					tempArr[n+1].push(array[i]);
					ArrVar_[n+1]=ArrVar_[n+1]+1;
					if(ArrVar_[n+1]==2){
							seriseArr.push(tempArr[n+1]);
							ArrVar_[n+1]=0;
							tempArr[n+1]=[];
							}
				}
				break;
			}
		
		}
		
	}

	//for(var 
	
	for(var i=0;i<ArrVar.length;i++)
	{
		if(tempArr[i].length>0){
			seriseArr.push(tempArr[i]);
		}

	}
	

        return seriseArr;
}






$(function () {
  

        $('#container').highcharts({

            chart: {
                type: 'arearange',
                zoomType: 'x'
            },

            title: {
                text: 'Temperature variation by day'
            },

            xAxis: {
                
            },

            yAxis: {
                title: {
                    text: null
                }
            },

            tooltip: {
                crosshairs: true,
                shared: true,
                valueSuffix: '°C'
            },

            legend: {
                enabled: false
            },

            series: [{
                name: 'Temperatures',
                data: [[1,2,3],[2,3,4],[,3,4,5]]
            }]

        });

});

</script>



</head>
<body>

<input type ="button" value="sss" onclick="test()" />
<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>


</body>
</html>